<template>
  <aside>

    <div v-if="type === 'node'">
      <div v-if="content.type === 'controller-start-node'">
        <controller-start-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'controller-end-node'">
        <controller-end-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'in-jdbc-node'">
        <in-jdbc-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'in-jdbc-page-node'">
        <in-jdbc-page-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'in-http-node'">
        <in-http-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'in-excel-node'">
        <in-excel-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'in-validate-node'">
        <in-validate-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'out-log-node'">
        <out-log-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'out-excel-node'">
        <out-excel-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'out-email-node'">
        <out-email-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'out-notify-info-node'">
        <out-notify-info-attr :selectContent="selectContent"/>
      </div>


      <div v-if="content.type === 'controller-break-node'">
        <controller-break-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'controller-continue-node'">
        <controller-continue-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'controller-return-node'">
        <controller-return-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'controller-circle-start-node'">
        <controller-circle-start-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'controller-combine-node'">
        <controller-combine-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'controller-if-start-node'">
        <controller-if-start-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'controller-route-node'">
        <controller-route-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'code-define-var-node'">
        <code-define-var-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'code-js-code-node'">
        <code-js-code-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'code-sql-code-node'">
        <code-sql-code-attr :selectContent="selectContent"/>
      </div>

      <!--ui-->
      <div v-if="content.type === 'ui-in-param-node'">
        <ui-in-param-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'ui-out-data-node'">
        <ui-out-data-attr :selectContent="selectContent"/>
      </div>

      <!--nosql-->
      <div v-if="content.type === 'nosql-save-node'">
        <nosql-save-node-attr :selectContent="selectContent"/>
      </div>
      <div v-if="content.type === 'nosql-page-node'">
        <nosql-page-node-attr :selectContent="selectContent"/>
      </div>

    </div>
    <div v-else-if="type === 'link'">
      <link-attr :selectContent="selectContent"/>
    </div>
    <div v-else>
      <canvas-attr/>
    </div>

  </aside>
</template>

<script>
// controller
import LinkAttr from "./attr/controller/LinkAttr";
import CanvasAttr from "./attr/controller/CanvasAttr";
import ControllerStartAttr from "./attr/controller/ControllerStartAttr";
import ControllerEndAttr from "./attr/controller/ControllerEndAttr";
import BaseNodeAttr from "./attr/controller/BaseNodeAttr";
import ControllerBreakAttr from "./attr/controller/ControllerBreakAttr";
import ControllerReturnAttr from "./attr/controller/ControllerReturnAttr";
import ControllerContinueAttr from "./attr/controller/ControllerContinueAttr";
import ControllerCircleStartAttr from "./attr/controller/ControllerCircleStartAttr";
import ControllerCombineAttr from "./attr/controller/ControllerCombineAttr";
import ControllerIfStartAttr from "./attr/controller/ControllerIfStartAttr";
import ControllerRouteAttr from "./attr/controller/ControllerRouteAttr";
// code
import CodeDefineVarAttr from "./attr/code/CodeDefineVarAttr";
import CodeJsCodeAttr from "./attr/code/CodeJsCodeAttr";
import CodeSqlCodeAttr from "./attr/code/CodeSqlCodeAttr";
// in
import InJdbcAttr from "./attr/in/InJdbcAttr";
import InJdbcPageAttr from "./attr/in/InJdbcPageAttr";
import InHttpAttr from "./attr/in/InHttpAttr";
import InExcelAttr from "./attr/in/InExcelAttr";
import InValidateAttr from "./attr/in/InValidateAttr";
// out
import OutLogAttr from "./attr/out/OutLogAttr";
import OutExcelAttr from "./attr/out/OutExcelAttr";
import OutEmailAttr from "./attr/out/OutEmailAttr";
import OutNotifyInfoAttr from "./attr/out/OutNotifyInfoAttr";
// ui
import UiInParamAttr from "./attr/ui/UiInParamAttr";
import UiOutDataAttr from "./attr/ui/UiOutDataAttr";
// nosql
import NosqlSaveNodeAttr from "./attr/nosql/NosqlSaveNodeAttr";
import NosqlPageNodeAttr from "./attr/nosql/NosqlPageNodeAttr";


export default {
  name: "FlowAttr",
  components: {
    BaseNodeAttr,ControllerStartAttr,ControllerEndAttr,
    LinkAttr, CanvasAttr,ControllerContinueAttr,ControllerBreakAttr,ControllerReturnAttr,ControllerCircleStartAttr,
    ControllerCombineAttr,ControllerIfStartAttr,ControllerRouteAttr,
    CodeDefineVarAttr,CodeJsCodeAttr,CodeSqlCodeAttr,
    InJdbcAttr,InJdbcPageAttr,InHttpAttr,InExcelAttr,InValidateAttr,
    OutLogAttr,OutExcelAttr,OutEmailAttr,OutNotifyInfoAttr,
    UiInParamAttr,UiOutDataAttr,
    NosqlSaveNodeAttr,NosqlPageNodeAttr
  },
  data() {
    return {
      content: {},
      type: "",
      jspInit: this.$store.state.taskflow.jspInit,
    };
  },
  computed: {
    selectContent() {
      return this.$store.state.taskflow.selectContent;
    },
  },
  watch: {
    selectContent(data) {
      this.content = data.data;
      this.type = data.type;
    },
  },
  mounted() {
  },
  methods: {
  },
};
</script>

<style scoped lang="scss">

</style>
